<template>
  <div class="container">
    <project_list v-if="index == 1"></project_list>
    <engineer_list v-if="index == 2" :projectId="projectId"></engineer_list>
    <process_list
      v-if="index == 3"
      :engineeringId="engineeringId"
      :projectId="projectId"
    ></process_list>
    <device_list
      v-if="index == 4"
      :processId="processId"
      :projectId="projectId"
      :engineeringId="engineeringId"
    ></device_list>
  </div>
</template>

<script lang="ts" setup>
import { ref, onMounted, onUnmounted } from 'vue'
import project_list from './projectList.vue'
import engineer_list from './engineerList.vue'
import process_list from './process.vue'
import device_list from './device.vue'
import EventBus from '@/utils/EventBus'
const index = ref(1)
const projectId = ref()
const engineeringId = ref()
const processId = ref()
const deviceId = ref()
onMounted(() => {
  // 页面跳转 参数 12345
  EventBus.on('list_change', (e) => {
    index.value = e as any
  })
  // 存项目id
  EventBus.on('projectId', (e) => {
    projectId.value = e as any
  })
  // 存工程id
  EventBus.on('engineeringId', (e) => {
    engineeringId.value = e as any
  })
  // 存工序id
  EventBus.on('processId', (e) => {
    processId.value = e as any
  })
  // 存设备id
  EventBus.on('deviceId', (e) => {
    deviceId.value = e as any
  })
})
onUnmounted(() => {
  EventBus.off('list_change')
  EventBus.off('projectId')
  EventBus.off('engineeringId')
  EventBus.off('processId')
  EventBus.off('deviceId')
})
</script>

<style lang="scss" scoped>
.container {
  height: 100%;
  > div {
    height: 100%;
  }
}
</style>
